<template>
    <div>
        <div class="layout-content-breadcrumb">
            <Breadcrumb>
                <Breadcrumb-item>内容管理</Breadcrumb-item>
                <Breadcrumb-item>内容详情</Breadcrumb-item>
            </Breadcrumb>
        </div>
        <div class="page-content">
            <Row type="flex" :gutter="16">
                <Col span="18">
                <Form ref="model" :model="model" :label-width="80">
                    <Form-item label="分类*">
                        {{model.category}}

                    </Form-item>
                    <Form-item label="标题*">
                        {{model.title}}

                    </Form-item>
                    <Form-item label="内容*">
                        <div v-html="model.content"></div>
                    </Form-item>
                    <Form-item label="关键词">
                        {{model.match_keyword}}

                    </Form-item>
                </Form>
                </Col>
            </Row>
        </div>
    </div>
</template>
<style lang="less">

</style>
<script>
    import api from 'service/information'
    export default{
        data(){
            return {
                model: {}
            }
        },
        mounted(){
            this.getDetail()
        },
        methods: {
            getDetail(){
                api.getDetail({id: this.$route.params.id})
                    .then(({data}) => {
                        this.model = {
                            category: data.category.title,
                            title: data.title,
                            content: data.content,
                            match_keyword: data.match_keyword
                        }
                    })
            }
        }
    }
</script>